<template>
	<span>
		<template v-for="item in options_">
			<template v-if="value === item[valueName]">
				{{ item[labelName] }}
			</template>
		</template>
	</span>
</template>

<script setup lang="ts" name="DictText">
import { ref, watchEffect } from 'vue'
import dict from '@/utils/dict/index'

type Optioin = { [key: string]: any }
// 默认值
const props = withDefaults(
	defineProps<{
		options?: Optioin[] // 字典列表
		dict?: string // 字典类型 code
		value?: string | number // 值
		labelName?: string // label 字段名
		valueName?: string // value 字段名
	}>(),
	{
		labelName: 'label',
		valueName: 'value'
	}
)

let options_ = ref<Optioin[]>([])
watchEffect(() => {
	if (props.dict) {
		dict.$cache.getDict(props.dict).then((result: Optioin[]) => {
			options_.value = result
		})
	} else if (props.options) {
		options_.value = props.options
	}
})
</script>
<style scoped lang="scss"></style>
